<template>
  <div>
    <van-nav-bar fixed title="数据统计" left-arrow @click-left="$utils.back($route.path);" />
    <div class="has-top pos-r ">
      <div class="plr-32 ptb-32">
        <div class="wrapper mb-32">
          <img :src="require('@/assets/images/statisticalbg.png')"/>
          <div class="data plr-48 pt-80 color-white fs-28">
            <div class="pb-12">让利宝总量池</div>
            <strong class="color-white fs-60">{{datalist.TotalAmount}}</strong>
          </div>
        </div>
        <div class="list">
          <div class="flex-s-c">
            <img :src="require('@/assets/images/statisticalicon4.png')"/>
            <div>
              <div class="fs-28">让利宝释放量</div>
              <strong class="fs-40">{{datalist.TotalReleaseAmount}}</strong>
            </div>
          </div>
          <div class="flex-s-c">
            <img :src="require('@/assets/images/statisticalicon3.png')"/>
            <div>
              <div class="fs-28">让利宝剩余池</div>
              <strong class="fs-40">{{datalist.TotalResidualAmount}}</strong>
            </div>
          </div>
          <div class="flex-s-c">
            <img :src="require('@/assets/images/statisticalicon2.png')"/>
            <div>
              <div class="fs-28">今日让利量</div>
              <strong class="fs-40">{{datalist.TodayDiscount}}</strong>
            </div>
          </div>
          <div class="flex-s-c">
            <img :src="require('@/assets/images/statisticalicon1.png')"/>
            <div>
              <div class="fs-28">燃烧总量池</div>
              <strong class="fs-40">{{datalist.BurnAmount}}</strong>
            </div>
          </div>
        </div>
      </div>

    </div>
  </div>
</template>

<script>
import { GetBonusPointsRewardReport} from 'api/report'
import { RegisterByWeixin} from 'api/authorize'

import utils from 'utils/utils'
export default {
  components: {
  },
  data() {
    return {
      datalist:{}
    }
  },
  watch: {
    // dateSelect(newVal, oldVal) {
    //   if (newVal === true) {
    //     this.Icon = 'arrow-up'
    //   } else {
    //     this.Icon = 'arrow-down'
    //   }
    // }
  },
  created() {
    this.getData()
  },
  mounted() {

  },
  methods: {
    getData(){
      GetBonusPointsRewardReport().then(res => {
        if (res.State==1) {
           this.datalist = res.Data
            
        }
      })
      // let paran = {
      //   open_id: 'onjfo5yzKqK_BgYBlwJPPNEuALYA',
      //   union_id: 'o3cGPs1R980SI0mHPrnkbNpr8LWg',
      //   nick_name: '%e6%b3%a2',
      //   face: 'https%3a%2f%2fthirdwx.qlogo.cn%2fmmopen%2fvi_32%2fDYAIOgq83epDBicngIpdGiagcjzbiaap0jVglNDvlNG3Pja7ia6UMibkqN69JFiaqt6ibPya3icVQ6SxZJTvQAlsQ5WvbA%2f132',
      //   sex: 0,
      //   country:'',
      //   province:'' ,
      //   city:'' ,
      //   platform: 'WX'
      // }
      // RegisterByWeixin(paran).then(res => {
      //   if (res.State==1) {
            
      //   }
      // })
    },
    // // 滚动事件触发下拉加载
    // onScroll() {
    //   const _this = this
    //   if (_this.scollRequest === true) {
    //     if (utils.getScrollHeight() - utils.getClientHeight() - utils.getScrollTop() <= 5) {
    //       _this.scollRequest = false
    //       console.log('加载')
    //       if (_this.requestData.PageIndex < _this.totalAmout) {
    //         _this.requestData.PageIndex++
    //         _this.GetUserWaitSettleReward()
    //       } else {
    //         console.log('end')
    //         _this.end = true
    //       }
    //     }
    //   }
    // }
  }
}
</script>
<style lang="scss" scoped>
.body{
}
.color-white{
  /deep/.van-nav-bar__title,/deep/.van-icon{
    color:$colorF;
  }
}
/deep/.van-hairline--bottom::after{
  border-bottom: none;
}
.wrapper{
  width: 690px;
  height: 292px;
  background: linear-gradient(132deg, #F49C36 0%, #FFBD70 100%);
  border-radius: 24px;
  position: relative;
  img{
    width: 100%;
    height: 100%;
  }
  .data{
    margin-top: -292px;
  }
}
.list{
  & > div{
    width: 690px;
    height: 144px;
    background: #FFFFFF;
    border-radius: 24px;
    img{
      width: 64px;
      height: 64px;
      margin:0 22px 0 32px;
    }
  }
  .flex-s-c{
    margin-bottom: 32px;
    div{
      flex: 1;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding-right: 32px;
    }
    .fs-24{
      // padding-bottom: 16px;
    }
  }
}
.data{
  position: relative;
}
</style>
